<template>
 <div>
    <Index/>

    
    <div class="Minemessage">
        <div class="title"><h3>关于我我</h3></div>
        <div class="numberMessage">
            <span>2020年12月24日</span>
            <span>/</span>
            <span>0评论</span>
            <span>/</span>
            <span>360阅读</span>
        </div>

        <div class="gang">
           
        </div>
            <div class="desMessage">
                <div class="icons iconsname">
                    <span>
                    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-person-bounding-box" viewBox="0 0 16 16">
                        <path fill-rule="evenodd" d="M1.5 1a.5.5 0 0 0-.5.5v3a.5.5 0 0 1-1 0v-3A1.5 1.5 0 0 1 1.5 0h3a.5.5 0 0 1 0 1h-3zM11 .5a.5.5 0 0 1 .5-.5h3A1.5 1.5 0 0 1 16 1.5v3a.5.5 0 0 1-1 0v-3a.5.5 0 0 0-.5-.5h-3a.5.5 0 0 1-.5-.5zM.5 11a.5.5 0 0 1 .5.5v3a.5.5 0 0 0 .5.5h3a.5.5 0 0 1 0 1h-3A1.5 1.5 0 0 1 0 14.5v-3a.5.5 0 0 1 .5-.5zm15 0a.5.5 0 0 1 .5.5v3a1.5 1.5 0 0 1-1.5 1.5h-3a.5.5 0 0 1 0-1h3a.5.5 0 0 0 .5-.5v-3a.5.5 0 0 1 .5-.5z"/>
                        <path fill-rule="evenodd" d="M3 14s-1 0-1-1 1-4 6-4 6 3 6 4-1 1-1 1H3zm5-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6z"/>
                    </svg>
                    </span>
                    <span>博主：姓 徐</span>
                </div>
                <div class="icons iconsSex">
                    <span>
                    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-person-bounding-box" viewBox="0 0 16 16">
                        <path fill-rule="evenodd" d="M1.5 1a.5.5 0 0 0-.5.5v3a.5.5 0 0 1-1 0v-3A1.5 1.5 0 0 1 1.5 0h3a.5.5 0 0 1 0 1h-3zM11 .5a.5.5 0 0 1 .5-.5h3A1.5 1.5 0 0 1 16 1.5v3a.5.5 0 0 1-1 0v-3a.5.5 0 0 0-.5-.5h-3a.5.5 0 0 1-.5-.5zM.5 11a.5.5 0 0 1 .5.5v3a.5.5 0 0 0 .5.5h3a.5.5 0 0 1 0 1h-3A1.5 1.5 0 0 1 0 14.5v-3a.5.5 0 0 1 .5-.5zm15 0a.5.5 0 0 1 .5.5v3a1.5 1.5 0 0 1-1.5 1.5h-3a.5.5 0 0 1 0-1h3a.5.5 0 0 0 .5-.5v-3a.5.5 0 0 1 .5-.5z"/>
                        <path fill-rule="evenodd" d="M3 14s-1 0-1-1 1-4 6-4 6 3 6 4-1 1-1 1H3zm5-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6z"/>
                    </svg>
                    </span>
                    <span>性别：男</span>
                    <span>爱好：女？</span>
                    <span>年龄：20</span>
                </div>
                 <div class="icons iconsContact">
                    <span>
                    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-person-bounding-box" viewBox="0 0 16 16">
                        <path fill-rule="evenodd" d="M1.5 1a.5.5 0 0 0-.5.5v3a.5.5 0 0 1-1 0v-3A1.5 1.5 0 0 1 1.5 0h3a.5.5 0 0 1 0 1h-3zM11 .5a.5.5 0 0 1 .5-.5h3A1.5 1.5 0 0 1 16 1.5v3a.5.5 0 0 1-1 0v-3a.5.5 0 0 0-.5-.5h-3a.5.5 0 0 1-.5-.5zM.5 11a.5.5 0 0 1 .5.5v3a.5.5 0 0 0 .5.5h3a.5.5 0 0 1 0 1h-3A1.5 1.5 0 0 1 0 14.5v-3a.5.5 0 0 1 .5-.5zm15 0a.5.5 0 0 1 .5.5v3a1.5 1.5 0 0 1-1.5 1.5h-3a.5.5 0 0 1 0-1h3a.5.5 0 0 0 .5-.5v-3a.5.5 0 0 1 .5-.5z"/>
                        <path fill-rule="evenodd" d="M3 14s-1 0-1-1 1-4 6-4 6 3 6 4-1 1-1 1H3zm5-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6z"/>
                    </svg>
                    </span>
                    <span>QQ：2211207925</span>
                   
                </div>
            </div>
            <div class="MineDes">
                <div class="line"></div>
                <div class="MineText"><p>Coldfront:巨蟹座，有一点点点点强迫症，性格诡异。爱好：比较广泛，游戏、听歌、阅读、电影，喜欢接触一些新鲜事物。座右铭：恰到好处的喜欢最好!</p></div>
            </div>
            ...测试中
    
    </div>

 </div>

</template>

<script>
import Index from "../Index"
import "../../../utils/cc"
export default {
    name:"blogSelf",
    components:{
        Index
    },
    data(){
        return{
            fileList:[
                
           
            ]
        }
    },
    methods:{
      
       
    }
}
</script>

<style>
.Minemessage{
    padding-left: 1.5rem;
    padding-right: 1.5rem;
    height: 100%;
  

}
    .title h3{
        margin: 1.5rem auto;
        text-align: center;
    }
    .numberMessage{
        text-align: center;
    }
    .numberMessage span{
      padding-left: 1rem;
      color: #666;
    }
    .gang{
        background-color: rgb(161, 161, 161);
        width: 90%;
        margin-left:5%;
        height: 1px;
        margin-top: 1rem;
    }
    .desMessage .icons{
         line-height: 4rem;
         height: 4rem;
    }
    .desMessage .icons span{
         padding-left:2rem;
        line-height: 16px;
        font-size: 1.4rem;
    }
    .iconsname{
        margin-top: 2rem;
        background-color: rgb(205, 235, 207);
    }
    .iconsname span{
        color: rgb(74, 204, 74);
    }
    .iconsSex{
        margin-top: 4.5rem;
        background-color: rgba(241, 241, 238, 0.979);
    }
    .iconsSex span{
        color:rgb(248, 173, 12);
    }
    .iconsContact{
        margin-top: 4.5rem;
        background-color: rgba(241, 241, 238, 0.979);
    }
      .iconsContact span{
        color:#666;
    }
    .MineDes{
        display:flex;
        flex-direction: row;
        margin-top: 3.5rem;
        background-color: #f1f1ee;
        color: #666;
        
    }
    .line{
        width:1rem;
        background-color: blue;
    }
    .MineText{
        padding-left: 1.5rem;
        height: 10rem;
        letter-spacing: 1px;
        
    }
    .MineText p{
        padding-top: 10px;
        padding-bottom: 10px;
    }
  
</style>